<template>
  <div style="margin: auto ;width: 90%;">
    <p>采购审核</p>
    <el-table :data="schemeList.records" stripe style="width: 100% ;margin-top: 20px">
      <el-table-column prop="idNum" label="采购方案编号"/>
      <el-table-column prop="createDate" label="申请时间"/>
      <el-table-column prop="cause" label="采购原因" />
      <el-table-column prop="dealDate" label="处理时间"/>
<!--      <el-table-column prop="content" label="采购内容"/>-->
      <el-table-column label="操作">
        <template #default="scope">
          <el-button  type="primary" style="width: 100%;height: auto"  @click="this.findById(scope.row.idNum)">处理/详情</el-button>
        </template>
      </el-table-column>
    </el-table>
    <!--分页-->
    <el-pagination
        v-model:current-page="pageNo"
        v-model:page-size="mainPageSize"
        background
        layout="prev, pager, next, jumper"
        :total="schemeList.total"
        @current-change="caigoudaishenhe()"
    />
    <div>
      <p>审核状态选择</p>
      <el-select v-model="value"
                 placeholder="请选择" @change="caigoudaishenhe()">
        <el-option v-for="(option, index) in options" :key="index" :label="option.label" :value="option.value">
        </el-option>
      </el-select>
    </div>
<!--    方案详情窗口-->
    <el-dialog v-model="dialogVisible0" title="采购信息详情" width="70%">
      <el-descriptions title="详细信息列表" direction="vertical" :column="4" border>
        <el-descriptions-item label="采购方案编号">{{this.schemeBean.idNum}}</el-descriptions-item>
        <el-descriptions-item label="采购原因">{{this.schemeBean.cause}}</el-descriptions-item>
<!--        <el-descriptions-item label="采购内容">{{this.schemeBean.content}}</el-descriptions-item>-->
        <el-descriptions-item label="采购状态">{{this.schemeBean.status}}</el-descriptions-item>
        <el-descriptions-item label="采购申请人">{{this.schemeBean.applicant}}</el-descriptions-item>
        <el-descriptions-item label="申请时间">{{this.schemeBean.createDate}}</el-descriptions-item>
        <el-descriptions-item label="处理时间">{{this.schemeBean.createDate}}</el-descriptions-item>
        <el-descriptions-item label="审核人">{{this.schemeBean.adminName}}</el-descriptions-item>
        <el-descriptions-item label="审核理由">{{this.schemeBean.refuse}}</el-descriptions-item>
      </el-descriptions>
      <el-button  type="primary" v-if="value==0" @click="updateById(1)">审核通过</el-button>
      <el-button  type="primary" v-if="value==0"  @click="kaiqibutongguo">审核不通过</el-button>
      <el-button @click="showDialogclose1">关闭</el-button>
    </el-dialog>

    <!--    点击不通过后打开窗口-->
    <el-dialog  v-model="dialogVisible1" title="审核不通过原因" width="60%">
      <el-input type="textarea" :rows="2" placeholder="请输入内容" v-model="textarea"></el-input>
      <el-button  type="success" @click="tijiao">提交</el-button>
      <el-button @click="showDialogclose2">关闭</el-button>
    </el-dialog>
  </div>
</template>

<script>
import axios from "axios";
export default {
  data() {
    return {
      options: [
        { label: '未审核', value: '0' },
        { label: '审核不通过', value: '2' },
        { label: '审核通过', value: '1' }
      ],//多选框
      value:'0',//多选框的值
      schemeList: {},//采购申请方案集合
      mainPageSize:3,//一页的数据
      pageNo:1,//当前页
      type:"",
      stat:"",//状态
      dialogVisible0:false,//方案详情窗口
      schemeBean:"",//申请方案详细信息
      dialogVisible1:false,//点击不通过后打开窗口
      textarea: '',//不通过理由文本
  }},
   methods:{
    init(){
      this.caigoudaishenhe();
    },
     //提交按钮方法
     tijiao(){
      if (this.textarea!==""){
       axios.get("/project/scheme/updatetext",{
         params:{
           idNum:this.schemeBean.idNum,
           text:this.textarea,
         }
       }).then(resp=>{
         if (resp.data==="ok"){
           this.$message({
             message: "操作成功",
             type: "success",
             showClose: true,
           });
           this.updateById(2);
           this.showDialogclose2();
           this.init();
         }else {
           this.$message({
             message: "操作失败",
             type: "error",
             showClose: true,
           });
         }
       })
     }else {
        this.$message.error('请输入不通过理由');
      }
      },
     //修改审核状态
     updateById(stas){
       axios.get("/project/scheme/updateById",{
         params:{
           idNum:this.schemeBean.idNum,
           status:stas,
         }
       }).then(resp=>{
         if (resp.data==="ok"){
           this.$message({
             message: "操作成功",
             type: "success",
             showClose: true,
           });
           this.showDialogclose1();
           this.init();
         }else {
           this.$message({
             message: "操作失败",
             type: "error",
             showClose: true,
           });
           this.showDialogclose1();
           this.init();
         }
       })
     },
     // 关闭详情弹窗
    showDialogclose1() {
      this.dialogVisible0 = false;
    },
     // 关闭不通过弹窗
     showDialogclose2() {
       this.dialogVisible1 = false;
     },
     //开启不通过信息弹窗
     kaiqibutongguo(){
       this.dialogVisible1 = true;
     },
     // 根据状态分页查询出采购审核方案
    caigoudaishenhe(){
      axios.get("/project/scheme/findcaigou",{
        params:{
          status:this.value,
          pageNo:this.pageNo
        }
      }).then(resp=>{
          this.schemeList=resp.data;
      })
    },
     //查询方案详情
     findById(idnum){
       this.dialogVisible0 = true;
       axios.get("/project/scheme/findById",{
         params:{
           idNum:idnum,
         }
       }).then(resp=>{
         this.schemeBean=resp.data;
         console.log(this.schemeBean)
       })
     }
    },
  created() {
    this.init();
  }
}
</script>

<style scoped>
</style>